<template>
    <div class="demo-container">
        <div class="menu">我是菜单</div>
        <div class="content">我是内容</div>
    </div>
</template>

<script setup lang="ts"></script>

<style lang="scss" scoped>
.demo-container {
    display: block;
    // 字体颜色：白色
    color: #fff;
    width: 300px;

    // 菜单
    .menu {
        // 这里设置采用行内块的形式，用于布局
        display: inline-block;
        width: 100px;
        height: 100px;
        background-color: #00c853;
    }

    // 内容
    .content {
        display: inline-block;
        width: 150px;
        height: 100px;
        background-color: #ffab00;
    }
}
</style>